<template>
    <div class="m-order-div">
        <img :src="goodsInfo.pic? goodsInfo.pic : require('@/assets/images/p_02.jpg')" alt="">
        <span>{{goodsInfo.name}}</span>
        <div>
            <em>x{{goodsInfo.quantity}}</em>
            <p>&yen;{{goodsInfo.total_amount || goodsInfo.price}}</p>
        </div>
    </div>
</template>
<script>
export default {
    name:'',
    props:['goodsInfo'],
    data () {
        return {
            base_url:process.env.API_HOST,
        }
    }
}
</script>
<style lang="less" scoped>
.m-order-div{
    background: @background-gray;
    .flex;
    align-items: flex-start;
    padding: .8rem;
    img{
        width: 4rem;
        height: 4rem;
    }
    span{
        flex:1;
        margin: 0 .6rem;
    }
    div{
        text-align: right;
        em{
            color: @secondary-gray;
        }
    }
}
</style>
